<template>
    <view class="dynamicModel-list-v">
        <view class="head-warp com-dropdown">
            <u-dropdown class="u-dropdown" ref="uDropdown" @close="closeData">
                <u-dropdown-item title="排序">
                    <view class="dropdown-slot-content">
                        <view class="dropdown-slot-content-main">
                            <u-cell-group>
                                <u-cell-item @click="cellClick(item)" :arrow="false" :title="item.label"
									 v-for="(item, index) in sortOptions" :key="index" :title-style="{color: sortValue == item.value ? '#2979ff' : '#606266' }">
                                    <u-icon v-if="sortValue == item.value" name="checkbox-mark" color="#2979ff" size="32"></u-icon>
                                </u-cell-item>
                            </u-cell-group>
                        </view>
                    </view>
                </u-dropdown-item>
                <u-dropdown-item title="筛选" >
                    <view class="dropdown-slot-content">
                        <view class="dropdown-slot-content-main search-main">
                            <view class="u-p-l-32 u-p-r-32 search-form">
								<u-form :model="searchForm" ref="searchForm" :errorType="['toast']" label-position="left" label-width="150">
                                    <u-form-item label="特种证书名称" prop="specialworkname">
										<u-input v-model="searchForm.specialworkname" placeholder="请输入特种证书名称" />
                                    </u-form-item>
                                    <u-form-item label="所在车间" prop="workshop">
										<u-input v-model="searchForm.workshop" placeholder="请输入所在车间" />
                                    </u-form-item>
                                    <u-form-item label="证书持有人" prop="specialpeoplename">
										<u-input v-model="searchForm.specialpeoplename" placeholder="请输入证书持有人" />
                                    </u-form-item>
                                    <u-form-item label="所在班组" prop="workteam">
										<u-input v-model="searchForm.workteam" placeholder="请输入所在班组" />
                                    </u-form-item>
                                    <u-form-item label="工种" prop="worktype">
										<u-input v-model="searchForm.worktype" placeholder="请输入工种" />
                                    </u-form-item>
                                    <u-form-item label="专业工龄" prop="specialworktime">
										<u-input v-model="searchForm.specialworktime" placeholder="请输入专业工龄" />
                                    </u-form-item>
                                    <u-form-item label="证书编号" prop="specialworknum">
										<u-input v-model="searchForm.specialworknum" placeholder="请输入证书编号" />
                                    </u-form-item>
                                    <u-form-item label="发证日期" prop="specialissuedate">
										<jnpf-date-range  v-model="searchForm.specialissuedate" />
                                    </u-form-item>
                                    <u-form-item label="发证机关" prop="specialissuegroup">
										<u-input v-model="searchForm.specialissuegroup" placeholder="请输入发证机关" />
                                    </u-form-item>
                                    <u-form-item label="培训时间" prop="studytime">
										<jnpf-date-range  v-model="searchForm.studytime" />
                                    </u-form-item>
                                    <u-form-item label="一次复审" prop="onetrial">
										<jnpf-date-range  v-model="searchForm.onetrial" />
                                    </u-form-item>
                                    <u-form-item label="二次复审" prop="twotrial">
										<jnpf-date-range  v-model="searchForm.twotrial" />
                                    </u-form-item>
                                    <u-form-item label="有效期" prop="validitytime">
										<jnpf-date-range  v-model="searchForm.validitytime" />
                                    </u-form-item>
                                    <u-form-item label="延期时间" prop="delaytime">
										<jnpf-date-range  v-model="searchForm.delaytime" />
                                    </u-form-item>
                                    <u-form-item label="延长时间" prop="extendtime">
										<u-input v-model="searchForm.extendtime" placeholder="请输入延长时间" />
                                    </u-form-item>
								</u-form>
                            </view>
							<view class="buttom-actions">
							  <u-button class="buttom-btn" @click="reset">重置</u-button>
							  <u-button class="buttom-btn" type="primary" @click="closeDropdown">检索</u-button>
							</view>
							<view class="dropdown-slot-bg" @click="$refs.uDropdown.close()"></view>
                        </view>
                    </view>
                </u-dropdown-item>
            </u-dropdown>
        </view>
		<view class="list-warp">
			<mescroll-uni ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :fixed="false" :down="downOption" :up="upOption">
				<view class="list">
					<view class="list-box" v-for="(item, index) in list" :key="item.prop">
						<u-swipe-action :index="index" @click="handleClick" @open="open" :options="options" @content-click="goDetail(item.id,item.flowState)">
                        <view class="item">
                        <view class="item-cell u-line-1" >
                            <text>特种证书名称：</text>
                            <text>{{item.specialworkname}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>所在车间：</text>
                            <text>{{item.workshop}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>证书持有人：</text>
                            <text>{{item.specialpeoplename}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>所在班组：</text>
                            <text>{{item.workteam}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>工种：</text>
                            <text>{{item.worktype}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>专业工龄：</text>
                            <text>{{item.specialworktime}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>证书编号：</text>
                            <text>{{item.specialworknum}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>发证日期：</text>
                            <text>{{item.specialissuedate}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>发证机关：</text>
                            <text>{{item.specialissuegroup}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>培训时间：</text>
                            <text>{{item.studytime}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>一次复审：</text>
                            <text>{{item.onetrial}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>二次复审：</text>
                            <text>{{item.twotrial}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>有效期：</text>
                            <text>{{item.validitytime}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>延期时间：</text>
                            <text>{{item.delaytime}}</text>
                        </view>
                        <view class="item-cell u-line-1" >
                            <text>延长时间：</text>
                            <text>{{item.extendtime}}</text>
                        </view>
                        </view>
						</u-swipe-action>
					</view>
				</view>
			</mescroll-uni>
		</view>
        <view class="com-addBtn" @click="addPage()" >
            <u-icon name="plus" size="60" color="#fff" />
        </view>
    </view>
</template>

<script>
    import resources from '@/libs/resources.js'
    import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
    import {
        getDictionaryDataSelector,
        getDataInterfaceRes
    } from '@/api/common'
    import request from '@/utils/request'
    export default {
		mixins: [MescrollMixin],
        data() {
            return {
                sortValue: '',
                searchForm: {
                    specialworkname:undefined,
                    workshop:undefined,
                    specialpeoplename:undefined,
                    workteam:undefined,
                    worktype:undefined,
                    specialworktime:undefined,
                    specialworknum:undefined,
                    specialissuedate:undefined,
                    specialissuegroup:undefined,
                    studytime:undefined,
                    onetrial:undefined,
                    twotrial:undefined,
                    validitytime:undefined,
                    delaytime:undefined,
                    extendtime:undefined,
                },
                downOption: {
                    use: true,
                    auto: false
                },
                upOption: {
                    page: {
                        num: 0,
                        size: 20,
                        time: null,
                    },
                    empty: {
                        use: true,
                        icon: resources.message.nodata,
                        tip: "暂无数据",
                        fixed: true,
                        top: "300rpx",
                        zIndex: 5,
                    },
                    textNoMore: '没有更多数据',
                    toTop: {
                        bottom: 250
                    }
                },
				list: [],
				listQuery: {
				    sort: 'desc',
				    sidx: '',
				    keyword: '',
				    json: ''
				},
				options: [
                    {
                        text: '删除',
                        style: {
                            backgroundColor: '#dd524d'
                        }
                    },
				],
				sortOptions:[
				    {
				        label: '特种证书名称降序',
				        sidx: 'specialworkname',
				        value: 'specialworknamedesc',
				        sort: 'desc'
				    },
				    {
				        label: '特种证书名称升序',
				        sidx: 'specialworkname',
				        value: 'specialworknameasc',
				        sort: 'asc'
				    },
				    {
				        label: '所在车间降序',
				        sidx: 'workshop',
				        value: 'workshopdesc',
				        sort: 'desc'
				    },
				    {
				        label: '所在车间升序',
				        sidx: 'workshop',
				        value: 'workshopasc',
				        sort: 'asc'
				    },
				    {
				        label: '证书持有人降序',
				        sidx: 'specialpeoplename',
				        value: 'specialpeoplenamedesc',
				        sort: 'desc'
				    },
				    {
				        label: '证书持有人升序',
				        sidx: 'specialpeoplename',
				        value: 'specialpeoplenameasc',
				        sort: 'asc'
				    },
				    {
				        label: '所在班组降序',
				        sidx: 'workteam',
				        value: 'workteamdesc',
				        sort: 'desc'
				    },
				    {
				        label: '所在班组升序',
				        sidx: 'workteam',
				        value: 'workteamasc',
				        sort: 'asc'
				    },
				    {
				        label: '工种降序',
				        sidx: 'worktype',
				        value: 'worktypedesc',
				        sort: 'desc'
				    },
				    {
				        label: '工种升序',
				        sidx: 'worktype',
				        value: 'worktypeasc',
				        sort: 'asc'
				    },
				    {
				        label: '专业工龄降序',
				        sidx: 'specialworktime',
				        value: 'specialworktimedesc',
				        sort: 'desc'
				    },
				    {
				        label: '专业工龄升序',
				        sidx: 'specialworktime',
				        value: 'specialworktimeasc',
				        sort: 'asc'
				    },
				    {
				        label: '证书编号降序',
				        sidx: 'specialworknum',
				        value: 'specialworknumdesc',
				        sort: 'desc'
				    },
				    {
				        label: '证书编号升序',
				        sidx: 'specialworknum',
				        value: 'specialworknumasc',
				        sort: 'asc'
				    },
				    {
				        label: '发证日期降序',
				        sidx: 'specialissuedate',
				        value: 'specialissuedatedesc',
				        sort: 'desc'
				    },
				    {
				        label: '发证日期升序',
				        sidx: 'specialissuedate',
				        value: 'specialissuedateasc',
				        sort: 'asc'
				    },
				    {
				        label: '发证机关降序',
				        sidx: 'specialissuegroup',
				        value: 'specialissuegroupdesc',
				        sort: 'desc'
				    },
				    {
				        label: '发证机关升序',
				        sidx: 'specialissuegroup',
				        value: 'specialissuegroupasc',
				        sort: 'asc'
				    },
				    {
				        label: '培训时间降序',
				        sidx: 'studytime',
				        value: 'studytimedesc',
				        sort: 'desc'
				    },
				    {
				        label: '培训时间升序',
				        sidx: 'studytime',
				        value: 'studytimeasc',
				        sort: 'asc'
				    },
				    {
				        label: '一次复审降序',
				        sidx: 'onetrial',
				        value: 'onetrialdesc',
				        sort: 'desc'
				    },
				    {
				        label: '一次复审升序',
				        sidx: 'onetrial',
				        value: 'onetrialasc',
				        sort: 'asc'
				    },
				    {
				        label: '二次复审降序',
				        sidx: 'twotrial',
				        value: 'twotrialdesc',
				        sort: 'desc'
				    },
				    {
				        label: '二次复审升序',
				        sidx: 'twotrial',
				        value: 'twotrialasc',
				        sort: 'asc'
				    },
				    {
				        label: '有效期降序',
				        sidx: 'validitytime',
				        value: 'validitytimedesc',
				        sort: 'desc'
				    },
				    {
				        label: '有效期升序',
				        sidx: 'validitytime',
				        value: 'validitytimeasc',
				        sort: 'asc'
				    },
				    {
				        label: '延期时间降序',
				        sidx: 'delaytime',
				        value: 'delaytimedesc',
				        sort: 'desc'
				    },
				    {
				        label: '延期时间升序',
				        sidx: 'delaytime',
				        value: 'delaytimeasc',
				        sort: 'asc'
				    },
				    {
				        label: '延长时间降序',
				        sidx: 'extendtime',
				        value: 'extendtimedesc',
				        sort: 'desc'
				    },
				    {
				        label: '延长时间升序',
				        sidx: 'extendtime',
				        value: 'extendtimeasc',
				        sort: 'asc'
				    },
				],
                menuId:'',
            }
        },
        onLoad(e){
			this.menuId = e.menuId
            uni.$on('refresh', () => {
                this.list = [];
                this.mescroll.resetUpScroll();
            })
            this.dataAll()
        },
        onUnload() {
            uni.$off('refresh')
        },
        methods:{
			dataAll(){
			},
			closeData(e){
			    if(e==1){
			        // this.reset()
			    }
			},
            upCallback(page) {
    //             for(let i in this.searchForm){
				// 	if(!this.searchForm[i]){
				// 		delete this.searchForm[i]
				// 	}
				// }
                const query = {
                    currentPage: page.num,
                    pageSize: page.size,
                    menuId : this.menuId,
                    ...this.listQuery,
                    ...this.searchForm
                }
                request({
                    url: '/api/example/Mt_safe_special_work/getList',
                    method: 'post',
                    data: query,
                }).then(res => {
					let _list = this.dataList(res.data);
                    this.mescroll.endSuccess(res.data.list.length);
                    if (page.num == 1) this.list = [];
                    const list = _list.map(o => ({
                        show: false,
                        ...o
                    }));
                    this.list = this.list.concat(_list);
                }).catch(() => {
                    this.mescroll.endErr();
                })
            },
            handleClick(index, index1) {
				const item = this.list[index]
                request({
                    url: '/api/example/Mt_safe_special_work/' + item.id,
                    method: 'delete'
                }).then(res => {
                    uni.showToast({
                        title: res.msg,
                        complete: () => {
                            this.$u.toast(res.msg)
                            this.list.splice(index, 1)
							if (!this.list.length) this.mescroll.showEmpty()
                        }
                    })
                })
            },
            open(index) {
                this.list[index].show = true;
                this.list.map((val, idx) => {
                    if (index != idx) this.list[idx].show = false;
                })
            },
            search() {
                if (this.isPreview == '1') return
                this.searchTimer && clearTimeout(this.searchTimer)
                this.searchTimer = setTimeout(() => {
                    this.list = [];
                    this.mescroll.resetUpScroll();
                }, 300)
            },
            goDetail(id, status) {
                let btnType = ''
                let btnList = []
                btnList.push('btn_edit')
                btnList.push('btn_detail')
                if(btnList.includes('btn_detail')){
                    btnType = "btn_detail"
                }
                if(btnList.includes('btn_edit')){
                    btnType = "btn_edit"
                }
                if(!btnType) return
                this.jumPage(id, status,btnType)
            },
            addPage() {
				this.jumPage()
			},
            jumPage(id, status,btnType){
				if (!id && !status) btnType = 'btn_add'
				uni.navigateTo({
                    url: id?'./form?menuId='+this.menuId+'&jurisdictionType='+btnType+'&id=' + id:'./form?menuId='+this.menuId+'&jurisdictionType='+btnType
                })
			},
            cellClick(item) {
                if (this.sortValue === item.value) return
                this.listQuery.sort = item.sort
                this.listQuery.sidx = item.sidx
                this.sortValue = item.value
                this.$refs.uDropdown.close();
                this.$nextTick(() => {
                    this.list = [];
                    this.mescroll.resetUpScroll();
                })
            },
            reset() {
                this.$refs.searchForm.resetFields()
            },
            closeDropdown() {
                this.$refs.uDropdown.close();
                this.$nextTick(() => {
                    this.list = [];
                    this.mescroll.resetUpScroll();
                })
            },
			dataList(data){
				let _list =[]
				for(let i=0;i<data.list.length;i++){
					let _data = data.list[i]
					_list.push(_data)
				}
				return _list;
			},
        },
    }
</script>

<style lang="scss">
    page {
        background-color: #f0f2f6;
        height: 100%;
        /* #ifdef MP-ALIPAY */
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        /* #endif */
    }
</style>
